// 有一些tabs 和触发tabs激活的方法handleTabsItemChange
// 在文本域里写文字触发
// 点击+ 就将图片缩小显示handleChooseImg事件   在xml里使用到自定义显示图片组件upImg    然后wx.chooseImage从本地或相册里选择图片    获取到显示的图片后拼接
// 移除图片：  获取图片下标、选择的图片数组   然后从图片数组里去掉某图片下标
// 点击提交：  显示提交成功延迟1.5s    然后setTimeout定时器时间到了就返回我的页面
import { request } from '../../request/http.js';
import regeneratorRuntime from '../../lib/runtime/runtime.js';



Page({
  data: {
    tabs: [
      { id: 0, value: '体验问题', isActive: true },
      { id: 1, value: '功能异常', isActive: false },
      { id: 2, value: '其他', isActive: false }
    ],
    // 选择的图片数组
    chooseImgs: [],
    textVal:'',
    //状态
    statu1:0,
    statu2: 0,
    statu3: 0,
    statu4: 0
    
  },
  UploadImgs: [],
  QueryParams: { url: '', textVal: '', minproblem:''},
  // QueryParams: {  },
  onLoad: function () {
    this.QueryParams.url = this.QueryParams.url || '';
    this.QueryParams.textVal = this.textVal || '';
    this.QueryParams.minproblem = this.QueryParams.minproblem || '';
  },
  //文本域的输入事件
  handleTextInput(e){
    // console.log(e.detail.value);
    this.setData({
      textVal:e.detail.value
    })
  },
  // 点击+号选择图片事件
  handleChooseImg() {
    
      wx.chooseImage({
        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
        sourceType: ['album', 'camera'],
        success: res => {
          // console.log(res.tempFilePaths);
          this.setData({
            chooseImgs: [...this.data.chooseImgs, ...res.tempFilePaths]
          })

        }
      })

    
  },
  // 移除图片
  handleRemoveImg(e) {
    const { index } = e.detail;
    let { chooseImgs } = this.data;
    chooseImgs.splice(index, 1);
    this.setData({ chooseImgs })
  },
  //提交
 handleSubmit() {
    //1.获取文本域内容，图片数组
    const {textVal,chooseImgs}=this.data;
   const minproblem = this.QueryParams.minproblem;
   console.log(minproblem);
    //2.合法性验证
    if(!minproblem){
      wx.showToast({
        title: '请选择问题种类',
        icon: 'none',
        mask: true
      });
      return;
    }
    if(!textVal.trim()){//如果去掉两端空格后没有值则不合法
      wx.showToast({
        title: '输入不合法',
        icon:'none',
        mask:true
      });
      return;
    }
    if (chooseImgs.length === 0) {//图片不能为空
      wx.showToast({ title: '图片不能为空',icon: 'none', mask: true });
      return;
    }
    if (this.data.chooseImgs.length > 1) {
      wx.showToast({ title: '最多上传一张张图片', icon: 'none', duration: 1000 });
      return;
    }
    //3.显示正在等待图片 图片上传
    wx.showLoading({
      title: '正在上传中',
      mask:true
    });
    //4.判断是否还有要上传的图片数组
    if(chooseImgs.length!=0){//还有图片要上传
      //5.循环数组上传图片
      chooseImgs.forEach((v,i)=>{
        wx.uploadFile({
          // url: 'http://localhost:8080/upload/picture', //自己的Java后台接口地址
          url: 'http://192.168.43.159:8080/upload/picture',
          filePath: v,
          name: 'content',
          header: {
            "Content-Type": "multipart/form-data",
            'accept': 'application/json',
          },
          formData: ({
          }),
          success:(result)=>{//请求图片变成网页连接，然后加在UploadImgs数组里
            // console.log("测试");
            // console.log(result);
            let url=result.data;
            
            this.QueryParams.url=url;
            this.QueryParams.textVal=textVal;
            this.QueryParams.minproblem = minproblem;
            console.log(url);
            console.log(textVal);
            // this.UploadImgs.push(url);
            if(i==chooseImgs.length-1){//如果都遍历完了就隐藏正在上传中提示
              wx.hideLoading();              
              // console.log(this.UploadImgs);
              console.log("提交完了！");

              //6.可以做我们自己服务器的一些操作 发送请求向后端服务器
              // const result = await request({ name: 'feedback', data: this.QueryParams })
              wx.request({
                // url: 'http://localhost:8080/feedback',
                url: 'http://192.168.43.159:8080/feedback',
                data:this.QueryParams
              })

              //7.重置页面   将页面里面的置为空，方便下一次再输入进来
              this.setData({
                textVal:'',
                chooseImgs:[],
                statu1:0,
                statu2: 0,
                statu3: 0,
                statu4: 0,
              })
              wx.showToast({
                  title: '反馈成功！',
                  icon: 'success',
                  duration: 3000,
                  mask: true,
                  success: function () {
                    setTimeout(function () {
                      wx.switchTab({//返回个人中心
                        url: '../user/index',
                      }) 
                    }, 1000)

                  }
                })
                  
            
            }          
          }
        }) 
      })

    }
  },
  //tabs
  handleTabsItemChange(e) {
    const { index } = e.detail;
    let { tabs } = this.data;
    tabs.forEach((v, i) => index == i ? v.isActive = true : v.isActive = false)
    this.setData({ tabs })
  },
  //功能建议
  gongnengjianyi(e){
    this.setData({ 
      statu2: 0,
      statu3: 0, 
      statu4: 0 
      })
    console.log(e.currentTarget.dataset.index);
    this.QueryParams.minproblem = e.currentTarget.dataset.index;
    this.setData({ statu1: 1 })
  },
  //购买遇到问题
  goumanwenti(e) {
    this.setData({
      statu1: 0,
      statu3: 0,
      statu4: 0
    })
    console.log(e.currentTarget.dataset.index);
    this.QueryParams.minproblem = e.currentTarget.dataset.index;
    this.setData({ statu2: 1 })
  },
  //性能问题
  xingneng(e) {
    this.setData({
      statu2: 0,
      statu1: 0,
      statu4: 0
    })
    console.log(e.currentTarget.dataset.index);
    this.QueryParams.minproblem = e.currentTarget.dataset.index;
    this.setData({ statu3: 1 })
  },
  //其他
  otherproblem(e) {
    this.setData({
      statu1: 0,
      statu2: 0,
      statu3: 0
    })
    console.log(e.currentTarget.dataset.index);
    this.QueryParams.minproblem = e.currentTarget.dataset.index;
    this.setData({statu4:1})
  },
})